<template>

    <div class="record">
        <el-icon>
            <Tickets />
        </el-icon>
        <span>数据列表</span>
    </div>
    <div class="table">
        <el-table border :data="data.data">
            <el-table-column prop="id" label="编号" />
            <el-table-column prop="name" label="秒杀时段名称" />
            <el-table-column prop="state" label="每日开始时间">
                <template #default="scope">
                    {{ fomatDate(scope.row.startTime) }}
                </template>
            </el-table-column>
            <el-table-column prop="city" label="每日结束时间">
                <template #default="scope">
                    {{ fomatDate(scope.row.endTime) }}
                </template>
            </el-table-column>
            <el-table-column prop="productCount" label="商品数量" />
            <el-table-column label="操作">
                <template #default="scope">
                    <el-button link type="primary"
                        @click="router.push(`/sms/flashProductRelation?flashPromotionId=${state.flashPromotionId}&flashPromotionSessionId=${scope.row.id}`)">
                        商品列表</el-button>
                </template>
            </el-table-column>
        </el-table>
    </div>
</template>

<script setup lang="ts">
import { Tickets } from "@element-plus/icons-vue"
import { user } from "@/api"
import { reactive } from "vue";
import { useRoute, useRouter } from "vue-router"
import { fomatDate } from "@/utils"
const route = useRoute()
const router = useRouter()

// console.log(route.query.id);

const state = reactive({
    flashPromotionId: Number(route.query.id)
})
const data: { data: ISelectListAApi[] } = reactive({
    data: []
})
user.selectListAApi(state).then(res => {
    if (res.code == 200) {
        data.data = res.data

    }
})

const handleClick = () => {
    console.log('click')
}



</script>

<style lang="less" scoped>
.record {
    border: 1px solid #c0c4d1;
    margin-top: 20px;
    padding: 20px;
    color: black;
}

.table {
    margin-top: 20px;
}
</style>